Skip to content

feat(icon): File and folder icons for Postgraphile#3393

Open
Deckstar wants to merge 2 commits intomaterial-extensions:mainfrom
Deckstar:postgraphile
Open

feat(icon): File and folder icons for Postgraphile#3393
Deckstar wants to merge 2 commits intomaterial-extensions:mainfrom
Deckstar:postgraphile

Conversation

@Deckstar
Copy link
Copy Markdown
Contributor

Description

TLDR:

This pull request adds file and folder icons for common Postgraphile files and folders.

Context: What is PostGraphile?

Postgraphile is a library for quickly generating GraphQL APIs based on a PostgreSQL database. It currently has 12.9k GitHub stars and has just entered beta testing for its long-awaited v5. It's part of the overall Graphile project, which is a set of tools for working with PostgreSQL to create performant GraphQL APIs.

Contribution details

As part of this PR, I have:

  • Re-colored the original Postgraphile logo from the Postgraphile website to fit the Material Color scheme, as defined PKief's Material Color Converter tool.
  • Also made a yellow version of the logo for vanilla JavaScript files.
  • Made a folder icon, using the SVG for TypeScript folders as a template.

I also confirm that I have run bunx lint-staged in the repo and that all linting stages have passed.


Thank you very much for your time and this wonderful library! And I hope my new icons can be accepted 🙂


Contribution Guidelines

@github-actions github-actions bot added the icons PR with new icons label Mar 13, 2026
@github-actions
Copy link
Copy Markdown
Contributor

Preview

Thank you for creating a pull request. This preview shows you how your icons will look on the different themes:

Generated preview

Check how your icons fit in a 16x16 grid with our Pixel Perfect Checker by following this link.

You can find more information on how to contribute in the contribution guidelines.

@Deckstar Deckstar changed the title Feature (icons): File and folder icons for Postgraphile feat(icon): File and folder icons for Postgraphile Mar 13, 2026
@Deckstar
Copy link
Copy Markdown
Contributor Author

Deckstar commented Apr 3, 2026

Hey @PKief sorry for the direct tag. Just wondering if there's anything specific I need to do to get this reviewed? 🙂

@PKief
Copy link
Copy Markdown
Member

PKief commented Apr 4, 2026

@Deckstar Hi. Sorry for the late reply. Your proposed icons have too many shapes and doesn't follow our grid system:
https://pixp.pages.dev/material-extensions/vscode-material-icon-theme/pull/3393

You can find more information here:
https://github.com/material-extensions/vscode-material-icon-theme/blob/main/CONTRIBUTING.md#designing-pixel-perfect-icons

@PKief
Copy link
Copy Markdown
Member

PKief commented Apr 4, 2026

You can also try to use our new tool where you can actually see how VS Code will render your icon in a 16x16 pixel grid:
https://material-extensions.github.io/svg-pixel-preview/

This is how it will look like:
image

When we keep the shapes more simple and align the edges with the grid it will look better. Now's, the question how to do this. Not sure tbh, not every icon can fit directly into our theme. Usually we try to abstract some shapes to make it look similar to the original icon but following the grid lines, or we abstract even more by using some different icon (e.g. different elephant motive) which also fits and looks better as a file icons. Here it comes to the creativity part and the exploration part. That's why I can't give you a direct solution to this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

icons PR with new icons

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants